const path = require('path');
const uglify = require('uglifyjs-webpack-plugin');
const HTMLPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
const optimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin"); // 打包css
const Webpackbar = require('webpackbar');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

let env = process.env.NODE_ENV;
let config = {
    entry: {
        index: path.join(__dirname, 'src/views/gaokaohou/index.js')
    },
    output: {
        filename: '[name].js', // 文件输出
        path: path.resolve(__dirname, 'dist')
    },
    stats: {
        children: false
    },
    resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            "@": path.resolve(__dirname, "./src")
        }
    }
}

if (env == 'development') {
    config = Object.assign({}, config, {
        mode: 'development',
        module: {
            rules: [{
                    test: /\.js$/,
                    use: 'babel-loader',
                    exclude: path.resolve(__dirname, 'node-modules')
                }, {
                    test: /\.css$/, // 处理css文件
                    use: ["style-loader",
                        'css-loader', 'postcss-loader'
                    ]
                },
                {
                    test: /\.less$/,
                    use: ["style-loader", 'css-loader', 'postcss-loader', 'less-loader'],
                    exclude: path.resolve(__dirname, 'node-modules')
                },
                {
                    test: /\.(gif|jpg|jpeg|png|svg)$/, // 处理图片文件
                    use: [{
                        loader: 'url-loader',
                        options: {
                            limit: 1024,
                            name: 'image/[name].[ext]',
                            outputPath: 'static/',
                        }
                    }]
                }
            ]
        },
        plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                Swiper: "swiper"
            }),
            new HTMLPlugin({
                filename: './index.html',
                template: 'src/views/gaokaohou/index.html'
            }),
            new HTMLPlugin({
                filename: './index.html',
                template: 'src/views/gaokaohou/index.html'
            })
        ],
        devServer: {
            contentBase: "./lib", // 监听lib文件夹下内容
            hot: true //启动热更新
        },
        devtool: 'source-map'
    })
} else if (env == 'production') {
    config = Object.assign({}, config, {
        mode: 'production',
        module: {
            rules: [{
                    test: /\.js$/,
                    use: 'babel-loader',
                    exclude: path.resolve(__dirname, 'node-modules')
                }, {
                    test: /\.css$/, // 处理css文件
                    use: [MiniCssExtractPlugin.loader,
                        'css-loader', 'postcss-loader'
                    ]
                },
                {
                    test: /\.less$/,
                    use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'less-loader'],
                    exclude: path.resolve(__dirname, 'node-modules')
                },
                {
                    test: /\.(gif|jpg|jpeg|png|svg)$/, // 处理图片文件
                    use: [{
                        loader: 'url-loader',
                        options: {
                            limit: 1024,
                            name: 'image/[name].[ext]',
                            outputPath: 'static/',
                        }
                    }]
                }
            ]
        },
        plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                Swiper: "swiper"
            }),
            new uglify(),
            new HTMLPlugin({ // 打包输出HTML
                filename: './index.html',
                template: 'src/views/gaokaohou/index.html',
                minify: { // 压缩HTML文件
                    removeAttributeQuotes: true,    // 去除多余引号
                    removeComments: true,           // 去除注释
                    removeEmptyAttributes: true,    // 去除空属性
                    collapseWhitespace: true,        // 去除空白符与换行符
                    minifyCSS: true // 压缩内联css
                },
                chunks: ['index'] // chunks主要用于多入口文件，当你有多个入口文件，那就回编译后生成多个打包后的文件，那么chunks 就能选择你要使用那些js文件
            }),
            // 打包之前自动删上一次的打包结果
            new CleanWebpackPlugin(),
            // 打包时候的进度条
            new Webpackbar({
                color: 'purple'
            }),
            // 抽离css
            new MiniCssExtractPlugin({
                filename: "./bundle.css"
            }),
            // 压缩css
            new optimizeCssAssetsWebpackPlugin()
        ]
    })
} else if (env == 'polyfill') {
    config = {
        entry: ["@babel/polyfill", "./test-polyfill/index.js"],
        output: {
            filename: '[name].js',
            path: path.join(__dirname, 'lib')
        },
        module: {
            rules: [{
                test: /\.js$/,
                use: 'babel-loader',
                exclude: path.resolve(__dirname, 'node-modules')
            }]
        },
        plugins: [
            new HTMLPlugin({ // 打包输出HTML
                filename: './index.html',
                template: 'test-polyfill/index.html'
            })
        ],
        stats: {
            children: false
        }
    }
} else if (env == 'runtime') {
    config = {
        entry: ["./test-runtime/index.js"],
        output: {
            filename: '[name].js',
            path: path.join(__dirname, 'lib')
        },
        module: {
            rules: [{
                test: /\.js$/,
                use: 'babel-loader',
                exclude: path.resolve(__dirname, 'node-modules')
            }]
        },
        plugins: [
            new HTMLPlugin({ // 打包输出HTML
                filename: './index.html',
                template: 'test-runtime/index.html'
            })
        ],
        stats: {
            children: false
        }
    }
}

module.exports = config;